<template>
	<view class="container">
		<carousel class="sea-block-panel" :img-list="imgList" url-key="url" @selected="selectedBanner"/>
		
		<view class="sea-block-panel">
			<text class="uni-h4">轮播图</text>
			<text class="text-block">基于 swiper 的简单轮播图</text>
		</view>
	</view>
</template>

<script>
    import carousel from '@/components/vear-carousel/vear-carousel'
    export default {
        components: {
            carousel
        },
        data() {
            return {
                imgList: [{
                    url: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
                    id: 1
                },{
                    url: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
                    id: 2
                },{
                    url: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
                    id: 3
                },{
                    url: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
                    id: 4
                },]
            }
        },
        methods: {
            selectedBanner(item, index) {
                console.log('🥒', item, index)
            }
        }
    }
</script>